import React from 'react'
import Header from '../../component/header/header.js'
import { connect } from 'react-redux'
import { actionCreators } from '../../store/home/index'

/* const React = require('react')*/
//同构：一套react代码，在服务端执行一次，再在客户端执行一次
//common js
class Home extends React.Component{
  componentDidMount() {
    const { newsList, list} = this.props
    if (!newsList.length){
      list(false);
    }
  }
  render(){
    return (
      <div>
        hello world!!!{this.props.name}
        <button onClick={() => alert(123)}>按钮</button>
        <ul>
          {this.props.newsList && this.props.newsList.map(v => {
            return <li key={v.id}>{v.title}</li>
          })}
        </ul>
      </div>
    )
  }
}
Home.loadData = (store) =>{
  //负责在服务器端渲染之前，把这个路由需要的数据加载好
  return store.dispatch(actionCreators.list(true))
}
const mapStateToProps = (state) => ({
  name: state.home.name,
  newsList: state.home.newsList
})
const mapDispatchToProps = (dispatch) => ({
  list(){
    dispatch(actionCreators.list())
  }
})
export default connect( mapStateToProps, mapDispatchToProps )(Home)
/* module.exports = {
  default: Home
}
 */